#huaban_collector_protector {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  min-width: 1px;
  overflow: hidden;
  border-radius: 0px 0px;
  cursor: crosshair;
  background-color: rgba(0, 0, 0, 0.5);
  box-sizing: content-box;
  z-index: 2147483740 !important;
}
#huaban_collector_protector > div{
  margin: 0;
  cursor: auto;
}
#huaban_collector_container {
  position: absolute;
  z-index: 2147483750 !important;
}
#huaban_collector_boundary {
  position: relative;
  height: 100%;
  margin: 0;
  padding: 0;
  width: 100%;
  cursor: move;
  overflow: hidden;
  /*border: 1px solid #EB5367;*/
  z-index: 2147483747 !important;
}
.hc-dragline {
  position: absolute;
  opacity: 0.5;
  background: #EB5367 url('');
  font-size: 0px;
}
#hc_dragline_t {
  top: 0px;
  width: 100%;
  height: 1px;
}
#hc_dragline_d {
  bottom: 0px;
  width: 100%;
  height: 1px;
}
#hc_dragline_l {
  left: 0px;
  width: 1px;
  height: 100%;
}
#hc_dragline_r {
  right: 0px;
  width: 1px;
  height: 100%;
}
#hc_drag_size {
  display: none;
  position: absolute;
  left: 5px;
  top: -22px;
  height: 18px;
  line-height: 18px;
  min-width: 65px !important;
  padding-left: 4px;
  padding-right: 4px;
  font-family: arial,san-serif;
  font-weight: bold;
  font-size: 12px;
  text-align: center;
  color: #fff;
  background-color: rgba(10, 10, 10, 0.68);
  border-radius: 10px;
  box-shadow: 0 0 1px #fff;
  z-index: 2147483749 !important;
}
#hc_drag_cancel,
#hc_drag_crop {
  display: none;
  position: absolute ;
  bottom: -28px;
  height: 22px;
  line-height: 22px;
  min-width: 30px !important;
  padding: 0 10px;
  cursor: pointer;
  color: #ddd;
  background-color: rgba(0, 0, 0, 0.68);
  text-align: center;
  font-size: 12px;
  font-family: arial,san-serif;
  font-weight: bold;
  border-radius: 10px;
  box-shadow: 0 0 1px #fff;
  z-index: 2147483749 !important;
}
#hc_drag_size:hover,
#hc_drag_cancel:hover,
#hc_drag_crop:hover {
  color: #fff;
  box-shadow: 0 0 4px #fff;
}
#hc_drag_crop {
  right: 5px;
}
#hc_drag_cancel {
  right: 70px;
}
.hc-dragshadow {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.5);
  border: 0;
  z-index: 2147483748 !important;
}
#hc_dragshadow_t {
  left: 0;
  top: 0;
}
#hc_dragshadow_b {
  bottom: 0;
  right: 0;
}
#hc_dragshadow_l {
  bottom: 0;
  left: 0;
}
#hc_dragshadow_r {
  right: 0;
  top: 0;
}
.hc-dragdot {
  position: absolute;
  height: 6px;
  width: 6px;
  border-radius: 5px;
  border:1px solid #FFFFFF;
  background-color: #EB5367;
  z-index: 2147483749 !important;
}
#hc_dragdot_tr {
  cursor: ne-resize;
  right: -3px;
  top: -4px;
}
#hc_dragdot_tl {
  cursor: nw-resize;
  left: -4px;
  top: -4px;
}
#hc_dragdot_br {
  cursor: se-resize;
  bottom: -4px;
  right: -4px;
}
#hc_dragdot_bl {
  cursor: sw-resize;
  bottom: -4px;
  left: -4px;
}
#hc_dragdot_mt {
  cursor: n-resize;
  top: -4px;
  left: 50%;
  margin-left: -4px;
}
#hc_dragdot_mr {
  cursor: e-resize;
  right: -4px;
  top: 50%;
  margin-top: -4px;
}
#hc_dragdot_mb {
  cursor: s-resize;
  bottom: -4px;
  left: 50%;
  margin-left: -4px;
}
#hc_dragdot_ml {
  cursor: w-resize;
  left: -4px;
  top: 50%;
  margin-top: -4px;
}
.hc-dragbar {
  position: absolute;
  z-index: 2147483749 !important;
}
#hc_dragbar_t {
  cursor: n-resize;
  width: 100%;
  height: 8px;
  top: -4px;
}
#hc_dragbar_r {
  cursor: e-resize;
  width: 8px;
  height: 100%;
  right: -4px;
  top: 0;
}
#hc_dragbar_b {
  cursor: s-resize;
  width: 100%;
  height: 8px;
  bottom: -4px;
}
#hc_dragbar_l {
  cursor: w-resize;
  height: 100%;
  width: 8px;
  left: -4px;
  top: 0;
}
.hb-no-user-select {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
